<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title></title>
  <script src="../../components/echarts-4.0.4.min.js"></script>
  <style>
    html,
    body {
      width: 100%;
      height: 100%;
      background: #0A0F23;
    }

    * {
      margin: 0;
      padding: 0;
    }

  </style>
</head>

<body>
  <div id="main" style="width: 100%;height: 100%;"></div>
</body>
<script>
  var myChart = echarts.init(document.getElementById('main'));

  var data = [
      {
          name: '高等院校',
          children: [{
              name: '单位',
              value: 20,
              label: {
                  formatter: '{b}:{c}'
              }
          }, {
              name: '仪器数量',
              value: 43.81,
              label: {
                  formatter: '{b}:{c}%'
              }
          }],
          label: {
              formatter: '{b}'
          }
      },
      {
          name: '普通科研院所',
          children: [{
              name: '单位',
              value: 60,
              label: {
                  formatter: '{b}:{c}'
              }
          }, {
              name: '仪器数量',
              value: 18.3,
              label: {
                  formatter: '{b}:{c}%'
              }
          }],
          label: {
              formatter: '{b}'
          }
      },
      {
          name: '军工类科研院所',
          children: [{
              name: '单位',
              value: 33,
              label: {
                  formatter: '{b}:{c}'
              }
          }, {
              name: '仪器数量',
              value: 37.89,
              label: {
                  formatter: '{b}:{c}%'
              }
          }],
          label: {
              formatter: '{b}'
          }
      }
  ];

  var option = {
      title: {
          text: '仪器共享单位分类',
          left: 'center',
          top: '5%',
          textStyle: {
              color: '#fff',
              fontSize: 22
          }
      },
      color: ['#0179c4','#0097db','#00a3ac','#029f85','#009f5c','#81bd41','#f44a4a','#ed5f05', '#f29806', '#fdc901','#fdf100','#c0d528'],
      series: {
          type: 'sunburst',
          data: data,
          radius: '75%',
          center: ['50%', '55%']
      }
  };


  myChart.setOption(option);

</script>

</html>
